<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="font/iconfont.css">
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" href="css/index.css">
</head>
<body>
    <!-- 头部导航 -->
    <div class="nav-container">
        <div class="nav">
            <div class="nav-left">
                <a href="#">
                    <span>上海市</span>
                    <i class="iconfont icon-ico_arrowdown"></i>
                </a>
            </div>
            <ul class="nav_right">
                <li>
                    <span id="login_mark">
                        <a href="./login.html">
                            请登录
                            <i class="iconfont icon-ico_arrowdown"></i>
                        </a>
                        <!-- <b>/</b>              -->
                    </span>
                    <div class="hiden">
                        <img src="imgs/hearder1.jpg" alt="">
                        <a href="#">
                            <span>欢迎回来[请登录]</span>
                            <ul>
                                <li><a href="">我的收藏</a></li>
                            
                                <li><a href="">零钱</a></li>
                            
                                <li><a href="">我的唯品币</a></li>
                            </ul>
                            <ul>
                                <li><a href="">我的订单</a></li>
                            
                                <li><a href="">我的优惠券</a></li>
                           
                                <li><a href="">唯品金融</a></li>
                            </ul>
                        </a>

                    </div>
                    
                </li>
                <li>
                    <span id="register_mark">
                        <a href="./register.html">
                            注册
                            <i></i>
                        </a>
                    </span> 
                    <div class="hiden"></div>       
                </li>
                <li>
                    <span>
                        <img src="imgs/nav_img1.gif" alt="">
                        <a href="#">
                            签到有礼
                            <i></i>
                        </a>
                        <!-- <b>/</b> -->
                    </span>
                    <div class="hiden">
                        <h2>请前往<i>唯品会APP首页</i>签到哦</h2>
                        <p>即日起，签到网页端入口将下线，请前往“唯品会APP首页-签到领券”继续参与签到活动。</p>
                        <img src="imgs/header2.png" alt="">
                        <div>
                            <img src="imgs/hearder3.png" alt="">
                            <span>也可以用微信扫码签到哦</span>
                        </div>
                    </div>   
                </li>
                <li>
                    <span>
                        <a href="#">
                            我的订单
                            <i></i>
                        </a>
                        <!-- <b>/</b> -->
                    </span>  
                    <div class="hiden"></div>                 
                </li>
                <li>
                    <span>
                        <a href="#">
                            我的特卖
                            <i class="iconfont icon-ico_arrowdown"></i>
                        </a>
                        <!-- <b>/</b> -->
                    </span>
                    <div class="hiden">
                        <ul>
                            <li><a href="">商品收藏</a></li>
                            <li><a href="">品牌收藏</a></li>
                            <li><a href="">我的足迹</a></li>
                        </ul>
                    </div>                   
                </li>
                <li>
                    <span>
                        <a href="#">
                            会员俱乐部
                            <i class="iconfont icon-ico_arrowdown"></i>
                        </a>
                        <!-- <b>/</b>             -->
                    </span>
                    <div class="hiden">
                        <ul>
                            <li><a href="">俱乐部首页</a></li>
                            <li><a href="">唯品币兑换</a></li>
                        </ul>
                </li>
                <li>
                    <span>
                        <a href="#">
                            客户服务
                            <i class="iconfont icon-ico_arrowdown"></i>
                        </a>
                        <!-- <b>/</b>    -->
                    </span>
                    <div class="hiden">
                        <ul>
                            <li><a href="">联系客服</a></li>
                            <li><a href="">帮助中心</a></li>
                            <li><a href="">服务中心</a></li>
                            <li><a href="">知识产权投诉</a></li>
                        </ul>
                    </div>    
                </li>
                <li>
                    <span>
                        <i class="iconfont icon-shouji"></i>
                        <a href="#">手机版<i></i></a>
                        <!-- <b>/</b>                    -->

                    </span>
                    <div class="hiden"></div>
                </li>
                <li>
                    <span>
                        <a href="#">
                            更多
                            <i class="iconfont icon-ico_arrowdown"></i>
                        </a>
                    </span>
                    <div class="hiden">
                        <h5>合作专区</h5>
                        <p><a href="">唯品卡</a></p>
                        <h5>关于我们</h5>
                        <ul>
                            <li><a href="">Sell on vip</a></li>
                            <li><a href="">品牌招商</a></li>
                            <li><a href="">官方博客</a></li>
                        </ul>
                    
                </li>
            </ul>
        </div>
    </div>
    <!-- 搜索框 -->
    <div class="search-container">
        <div class="search-inner">
            <img src="imgs/search_img1.gif" alt="" class="logo">
            <div class="search-left">
                <a href="">
                    <img src="imgs/search_img2.gif" alt="">
                    <span>100%正品</span>
                </a>
                <a href="">
                    <img src="imgs/search_img3.gif" alt="">
                    <span>88元包邮</span>
                </a>
                <a href="">
                    <img src="imgs/search_img4.gif" alt="">
                    <span>退换无忧</span>
                </a>
            </div>
            <div class="search-box">
                <input type="text" placeholder="  SKII">
                <a class="search-button" href="./list.html">
                    <span class="iconfont icon-search"></span>
                </a>
                <ul class="search-mes">
                    <li><a href="">女士t恤</a></li>
                    <li><a href="">女士休闲裤</a></li>
                    <li><a href="">手机</a></li>
                    <li><a href="">护肤套装</a></li>
                    <li><a href="">女休闲鞋</a></li>
                </ul>
            </div>
            <div class="shopping-bags">
                <a href="">
                    <span class="iconfont icon-gouwudai" ></span>
                    <span ><a href="./cart.html">购物车</a></span>
                    <span class="span-r">0</span>
                </a>
            </div>
           
                <ul class="search-bottom">
                    <li class="sepcial"><a href="#">商品分类</a></li>
                    <li><a href="#">推荐</a></li>
                    <li><a href="#">3折疯抢</a></li>
                    <li><a href="#">唯品快抢</a></li>
                    <li><a href="#">唯品奥莱</a></li>
                    <li><a href="#">品牌清仓</a></li>
                    <li><a href="#">女装</a></li>
                    <li><a href="#">鞋包</a></li>
                    <li><a href="#">运动</a></li>
                    <li><a href="#">美妆</a></li>
                    <li><a href="#">男婴</a></li>
                    <li><a href="#">女婴</a></li>
                    <li>
                        <a href="#">
                        更多
                        <span class="iconfont icon-jiantouxia"></span>
                        </a>
                    </li>
                </ul>
        </div>
            
        
        
    </div>
    <!-- 轮播图部分 -->
    <div class="banner-container">
        <div class="banner-inner">
            <div class="imgbox">
                <a href="#">
                    <img src="imgs/banner2.jpg" alt="">
                </a>
                <a href="#">
                    <img src="imgs/banner3.jpg" alt="">
                </a>
                <a href="#">
                    <img src="imgs/banner4.jpg" alt="">
                </a>
                <div class="btn">
                    <span class="btn-left"><</span>
                    <span class="btn-right">></span>
                </div>
            </div>

            <ul>
                <a href=""><li>巴拉巴拉 全场低至1.8折</li></a>
                <a href=""><li class="special">美妆狂欢日 满199减30 上不封顶</li></a>
            </ul>
        </div>
        <div class="banner-bottom"></div>  
    </div>
    <!-- 美妆狂欢日 -->
    <div class="makeup-container">
        <div class="makeup-inner">
            <a href="#">
                <img src="imgs/make_up.jpg" alt="">
            </a>
            <div class="img-boxs">
                <div>
                    <a href="#">
                        <img src="imgs/make_up3.jpg" alt="">
                    </a>
                </div>
                <div>
                    <a href="#">
                        <img src="imgs/make_up2.jpg" alt="">
                    </a>
                </div>
                <div id="special">
                    <a href="#">
                        <img src="imgs/make_up4.jpg" alt="">
                    </a>
                </div>    
            </div>
        </div>
    </div>
    <!-- 每日必看专区 -->
    <div class="zone-container">
        <div class="zone-inner">
            <img src="imgs/zone1.jpg" alt="">
            <div class="zone-top">
                <div class="zone-left">
                    <a href="">
                        <img src="imgs/zone2.jpg" alt="">
                        <img src="imgs/zone3.jpg" alt="">
                        <img src="imgs/zone4.png"  alt="">
                        <img src="imgs/zone5.png" alt="">
                        <span>共3258款</span>
                        <span>特卖价</span>
                        <span>￥59</span>
                        <img src="imgs/zone6.jpg" alt="">
                        <img src="imgs/zone6.png" alt="">
                        <img src="imgs/zone7.png" alt="">
                        <span>共830款</span>
                        <span>特卖价</span>
                        <span>￥114</span>
                        <img src="imgs/zone8.jpg" alt="">
                        <img src="imgs/zone6.png" alt="">
                        <img src="imgs/zone9.png" alt="">
                        <span>共1649款</span>
                        <span>特卖价</span>
                        <span>￥912</span>    
                    </a>
                </div>
                <div class="zone-right">
                    <a href="">
                        <img src="imgs/zone9.jpg" alt="">
                        <img src="imgs/zone10.jpg" alt="">
                        <img src="imgs/zone11.png" alt="">
                        <img src="imgs/zone12.png" alt="">
                        <span>连衣裙</span>
                        <img src="imgs/zone10.jpg" alt="">
                        <img src="imgs/zone13.png" alt="">
                        <img src="imgs/zone14.png" alt="">
                        <span>运动休闲鞋</span>
                        <img src="imgs/zone10.jpg" alt="">
                        <img src="imgs/zone15.png" alt="">
                        <img src="imgs/zone16.png" alt="">
                        <span>女凉鞋</span>
                      
                    </a>
                </div>
            </div>
            <div class="zone-bottom">
                <a href="">
                    <img src="imgs/zone17.png" alt="">
                    <img src="imgs/zone18.jpg" alt="">
                    <img src="imgs/zone19.png" alt="">
                    <img src="imgs/zone20.png" alt="">
                    <span>特卖价</span>
                    <span>￥145</span>
                    <img src="imgs/zone19.jpg" alt="">
                    <img src="imgs/zone19.png" alt="">
                    <img src="imgs/zone21.png" alt="">
                    <span>特卖价</span>
                    <span>￥75</span>
                    <img src="imgs/zone22.jpg" alt="">
                    <img src="imgs/zone19.png" alt="">
                    <img src="imgs/zone23.png" alt="">
                    <span>特卖价</span>
                    <span>￥135</span>
                    <img src="imgs/zone24.jpg" alt="">
                    <img src="imgs/zone19.png" alt="">
                    <img src="imgs/zone25.png" alt="">
                    <span>特卖价</span>
                    <span>￥159</span>
                    <img src="imgs/zone26.jpg" alt="">
                    <img src="imgs/zone19.png" alt="">
                    <img src="imgs/zone27.png" alt="">
                    <span>特卖价</span>
                    <span>￥145</span>
                    <img src="imgs/zone28.jpg" alt="">
                    <img src="imgs/zone19.png" alt="">
                    <img src="imgs/zone29.png" alt="">
                    <span>特卖价</span>
                    <span>￥58</span>
            </a>
            </div>
        </div>
    </div>
    <!-- 大牌折扣专区 -->
    <div class="brand-container">
        <div class="brand-inner">
           
            <div>
                <a href="">
                    <img src="imgs/brand1.jpg" alt="">
                    <h4><span>3</span>折封顶 左岸男女装专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand2.jpg" alt="">
                    <h4><span>1.2</span>折起 MO&Co.集团-大牌特卖专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand3.jpg" alt="">
                    <h4><span>4.4</span>折封顶 ASK junior童装专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand4.jpg" alt="">
                    <h4><span>1.3</span>折起 COACH大牌特卖特卖专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand5.jpg" alt="">
                    <h4><span>1.9</span>折起 匡威converse专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand6.jpg" alt="">
                    <h4><span>1</span>折起 森马SEMIR专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand7.jpg" alt="">
                    <h4><span>4</span>折起 红蜻蜓男女装/运动户外专场</h4>
                </a>
            </div>
            <div>
                <a href="">
                    <img src="imgs/brand8.jpg" alt="">
                    <h4><span>2</span>折起 半亩花田护肤个护专场</h4>
                </a>
            </div>
        </div>
    </div>
    <!-- 底部 -->
    <div class="footer-container">
        <div class="footer-inner">
            <img src="imgs/footer1.png" alt="">
            <div class="footer-list">
                <dl>
                    <dt>服务保障</dt>
                    <dd><a href="">正品保证</a></dd>
                    <dd><a href="">7天无理由放心退</a></dd>
                    <dd><a href="">7x15小时客户服务</a></dd>
                    <dd><a href="">7天无理由随心换</a></dd>
                </dl>
                <dl>
                    <dt>购物指南</dt>
                    <dd><a href="">导购演示</a></dd>
                    <dd><a href="">订单操作</a></dd>
                    <dd><a href="">会员注册</a></dd>
                    <dd><a href="">账户管理</a></dd>
                    <dd><a href="">收货样品</a></dd>
                    <dd><a href="">会员等级</a></dd>

                </dl>
                <dl>
                    <dt>支付方式</dt>
                    <dd><a href="">23家主流网银支付</a></dd>
                    <dd><a href="">支付宝、银联等支付</a></dd>
                    <dd><a href="">信用卡支付</a></dd>
                    <dd><a href="">零钱支付</a></dd>

                </dl>
                <dl>
                    <dt>配送方式</dt>
                    <dd><a href="">配送范围及运费</a></dd>
                    <dd><a href="">验货与签收</a></dd>

                </dl>
                <dl>
                    <dt>售后服务</dt>
                    <dd><a href="">退货政策</a></dd>
                    <dd><a href="">退货流程</a></dd>
                    <dd><a href="">退款方式和时效</a></dd>
                    <dd><a href="">换货服务</a></dd>

                </dl>
                <dl>
                    <dt>唯品会APP二维码</dt>
                    <dd><img src="imgs/footer2.png" alt=""></dd>
                    <dd>下载唯品会移动APP</dd>
                </dl>

            </div>
            <div class="footer-infor">
            
                    <ul>
                        <li><a href="">关于我们 |</a></li>
                        <li><a href="">About us |</a></li>
                        <li><a href="">Investor Relations |</a></li>
                        <li><a href="">媒体报道 |</a></li>
                        <li><a href="">品牌招商 |</a></li>
                        <li><a href="">隐私条款 |</a></li>
                        <li><a href="">唯品诚聘 |</a></li>
                        <li><a href="">唯品卡 |</a></li>
                        <li><a href="">联系我们 |</a></li>
                        <li><a href="">廉政举报 |</a></li>
                    </ul>
                
            </div>
            <div class="footer-bottom">
                <p>Copyright © 2008-2021 vip.com，All Rights Reserved  使用本网站即表示接受 唯品会用户协议。版权所有 广州唯品会电子商务</p>
                <p><img src="imgs/police_icon.png">粤公网安备 44010302111111号    粤ICP备08114786号 增值业务经营许可证：粤B2-20170777 网络文化经营许可证：粤网文〔2018〕5030-1743号</p>              
                <p>经营主体证照   风险监测信息   互联网药品信息服务资格证书：（粤）-经营性-2018-0271 网络食品交易第三方平台备案凭证：粤B2-20170777 医疗器械网络交易服务第三方平台备案</p>
                <p>凭证：（粤）网械平台备字[2019]第00001号 出版物网络交易平台服务经营备案证：粤新出网备（2021）1号</p>

            </div>
            <img src="imgs/footer3.png" alt="">
        </div>

    </div>
</body>
<script src="js/index.js"></script>


</html>